$top-blue: #00b7ee;
$bottom-blue: #6db6ff;
@mixin box-size($w, $h, $bgc: transparent) {
  width: $w;
  height: $h;
  background-color: $bgc;
}
.web {
  margin: 0 auto;
  @include box-size(1000px, 2255px);
  border: 1px solid black;
  header {
    .border-top {
      @include box-size(1000px, 24px, $top-blue);
    }
    .nav {
      @include box-size(1000px, 116px, lightgreen);
      display: flex;
      .logo {
        margin: 38px 70px 15px 73px;
        @include box-size(121px, 63px, pink);
      }
      .subnav {
        display: flex;
        @include box-size(396px, 14px, pink);
        margin: 76px 48px 25px 0;
      }
      .search {
        @include box-size(216px, 30px, pink);
        border: 1px solid #000;
        margin-top: 69px;
        margin-bottom: 17px;
        position: relative;
        .search-icon {
          position: absolute;
          top: 5px;
          right: 8px;
          @include box-size(26px, 21px, lightgreen);
        }
      }
    }
    .banner {
      @include box-size(1000px, 400px, $top-blue);
    }
  }
  footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    @include box-size(1000px, 238px, transparent);
    .footer-top {
      margin-top: 44px;
      margin-bottom: 24px;
      display: flex;
      @include box-size(901px, 100px, transparent);
      .footer-info {
        li {
          font-size: 12px;
          margin-bottom: 9px;
        }
        li:first-child {
          font-size: 16px;
          font-weight: bold;
          margin-bottom: 27px;
        }
      }
      .footer-info:first-child {
        margin-right: 55px;
      }
      .footer-info:nth-child(2) {
        margin-right: 109px;
      }
      .footer-info:nth-child(3) {
        margin-right: 53px;
      }
      .footer-right {
        margin-left: 63px;
        @include box-size(284px, 104px, transparent);
        img {
          @include box-size(100%, 100%, transparent);
        }
      }
    }
    .footer-bottom {
      display: flex;
      @include box-size(1000px, 70px, $bottom-blue);
      .copyright {
        @include box-size(298px, 15px, lightgreen);
        margin: 42px 352px 13px 350px;
        font-size: 12px;
      }
    }
  }
}
